<template>
  <div class="bg-white my-[10px]">
    <BaseHead style="border-bottom: 0">预算明细（单位：万元）</BaseHead>
    <BaseTable>
      <tr>
        <td class="td-name">预算页扫描件</td>
        <td colspan="3" style="width: 87.5%">
          <p v-for="item in fileList" :key="item.fileId" class="my-[5px]">
            {{ item.fileName }}
            <el-link
              type="primary"
              @click="handleDownload(item.fileId, item.fileName)"
              class="ml-[5px]"
              >下载</el-link
            >
          </p>
        </td>
      </tr>
    </BaseTable>
    <el-table
      :data="budgetList"
      class="w-full"
      border
      stripe
      row-key="id"
      default-expand-all
      :tree-props="{ hasChildren: 'hasChild' }"
      show-summary
      :summary-method="summaryFn"
    >
      <el-table-column label="当前预算信息" align="center">
        <el-table-column type="index" label="序号" width="60px" />
        <el-table-column prop="name" label="预算科目" />
        <el-table-column prop="feeRatio" label="经费占比">
          <template #default="{ row }">
            {{ (row.feeRatio ? row.feeRatio : 0) + "%" }}
          </template></el-table-column
        >
        <el-table-column prop="yfFee" label="预算经费" />
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup>
import BaseHead from "@/views/project/components/BaseHead.vue";
import BaseTable from "@/views/project/components/BaseTable.vue";
import { budgetDetail } from "@/api/project/zx/lxxm";
import { handleDownload, fiexdNumber } from "@/utils/main";
const operateId = inject("id");
const budgetList = ref([]);
const fileList = ref([]);
const totalFee = ref(0); //总经费
//获取预算信息详情
const getBudgetDetail = async () => {
  const params = {
    proId: operateId.value,
  };
  try {
    const res = await budgetDetail(params);
    budgetList.value = res.data.bizProjectBudgetFeeList || [];
    totalFee.value = parseFloat(res.data.proInitOtherBaseInfoVo.feeAuthorize);
    fileList.value = res.data.proInitOtherBaseInfoVo.fileInfos || [];
  } catch (error) {
    console.log(error);
  }
};
//合计方法
const summaryFn = ({ columns, data }) => {
  const sums = [];
  columns.forEach((column, index) => {
    if (index == 0) {
      sums[index] = "";
    } else if (index == 1) {
      sums[index] = "合计";
    } else {
      let total = 0;
      data.forEach((item) => {
        total += parseFloat(item[column.property]);
      });
      if (index == 2) {
        sums[index] = fiexdNumber(total) + "%";
      } else {
        sums[index] = fiexdNumber(total, 6);
        //如果输入的经费合计等于总经费 则经费占比置为100 防止出现100.1% 这类情况
        if (fiexdNumber(total, 6) == totalFee.value) {
          sums[index - 1] = "100%";
        }
      }
    }
  });
  return sums;
};
onMounted(() => {
  getBudgetDetail();
});
</script>

<style scoped lang="scss"></style>
